<template>
    <div>
        <!--补出勤录入-->
        <Dialog
                ref="d1"
                dialogCls="mydlgg"
                headerCls="mydlgg-head"
                footerCls="mydlgg-foot"
                :dialogStyle="{ width: '500px' }"
                :modal="true"
                borderType="thin"
        >
            <div slot="header">
                <span class="headerIcon newlyAdded"></span>
                <span class="titleStyle">新增补出勤</span>
            </div>

            <div class="insidePadding">
                <fieldset class="fieldsetStyle">
                    <legend>
                        <b class="fieldsetLegend">选择时长范围</b>
                    </legend>

                    <div class="fleft">
                        <Label>开始日期</Label>
                        <DateBox
                                inputId="beginDate"
                                v-model="requestData.startDate"
                                format="yyyy-MM-dd"
                                :editable="false"
                        ></DateBox>
                    </div>
                    <div class="fleft">
                        <Label>补出勤时间</Label>
                        <NumberBox
                                :min="0"
                                :max="23"
                                v-model="startHours"
                                style="width:60px"
                        ></NumberBox>
                        <span class="inputStyle3"></span>
                        <NumberBox
                                :min="0"
                                :max="59"
                                v-model="startMinutes"
                                style="width:60px"
                        ></NumberBox>
                    </div>
                </fieldset>

                <fieldset class="fieldsetStyle" style="margin-bottom:10px;">
                    <legend>
                        <b style="color:red">*</b>
                        <b class="fieldsetLegend">原因</b>
                    </legend>
                    <!-- fieldset、legend如果需要带边框加标题的容器这俩标签必须保留 -->
                    <TextBox
                            :multiline="true"
                            v-model="requestData.description"
                            style="width:100%;height:50px"
                            placeholder="请填写补出勤原因（必填）"
                    ></TextBox>
                </fieldset>

                <fieldset class="fieldsetStyle">
                    <legend>
                        <b class="fieldsetLegend">上传附件</b>
                    </legend>
                    <!-- fieldset、legend如果需要带边框加标题的容器这俩标签必须保留 -->
                    <upload-file ref="upload1" />
                    <upload-file ref="upload2" />
                    <upload-file ref="upload3" />
                </fieldset>

            </div>



            <div slot="footer" style="border:none">
                <div class="footerDiv">
                    <!-- footer、footerDiv这两个div必须保留 -->
                    <LinkButton @click="saveRepair" class="saveBtn">保存</LinkButton>
                    <LinkButton @click="close" class="cancelBtn">返回
                    </LinkButton>
                </div>
            </div>
        </Dialog>

    </div>
</template>

<script>
    import { tableBoxHeight } from "@/api/communal";
    import dateUtil from "@/utils/dateUtils";
    import user from "@/api/user";
    import repair from "@/api/repairAttendance/repair";
    import UploadFile from "@/components/uploadFile";

    export default {
        components: {
            UploadFile
        },
        name: "",
        data() {
            return {
                gridLeft: "repairTree",
                startHours: 0,
                startMinutes: 0,
                loginUser: null,
                /*录入界面数据*/
                requestData: {
                    //上传的文件名数组
                    uploadFileNames: [],
                    //补出勤原因
                    description: "",
                    //补出勤开始日期
                    startDate: new Date(dateUtil.getDayTime()),
                    //补出勤结束日期
                    endDate: new Date(dateUtil.getDayTime()),
                    /*补出勤人员表格  选择的人员*/
                    peopleData: [],
                    startTime: 0,
                    endTime: 0,
                    userIds: '',
                    /*选择的总人数*/
                    peopleNum: 0
                }
            };
        },
        props: {
            parentSearch: Function
        },
        mounted() {
            tableBoxHeight();
            this.$refs.d1.close();
            this.getLoginInfo();
        },
        methods: {
            async getLoginInfo () {
                let res = await user.getLoginerInfoList({});
                if (res.success) {
                    this.loginUser = res.result[0];
                }
            },
            clearform(){
                this.requestData.uploadFileNames=[];
                this.requestData.description="";
                this.requestData.startDate = new Date(dateUtil.getDayTime());
                this.startHours = 0;
                this.startMinutes = 0;
            },
            open() {
                this.$refs.d1.open();
            },
            close() {
                this.$refs.d1.close();
                this.clearform()
            },
            async saveRepair() {
                this.getUploadFileNames();
                if (this.requestData.startDate == null || this.requestData.startDate == "") {
                    this.$messager.alert({
                        title: "系统提示",
                        icon: "info",
                        msg: "开始日期不能为空！"
                    });
                    return;
                }

                if (this.startHours == 0 && this.startMinutes == 0) {
                    this.$messager.alert({
                        title: "系统提示",
                        icon: "info",
                        msg: "补出勤时长不能为0！"
                    });
                    return;
                }

                if (this.requestData.description == "") {
                    this.$messager.alert({
                        title: "系统提示",
                        icon: "info",
                        msg: "补出勤原因不能为空！"
                    });
                    return;
                }

                this.requestData.startTime = this.startHours * 60 + this.startMinutes;
                this.requestData.peopleData.push({
                    userSerial: this.loginUser.userSerial
                });

                // this.requestData.firstdApprover = 0;
                // this.requestData.secondApprover = 0;
                // this.requestData.applyType = 1;

                this.$loading("正在提交...");
                let param = {
                    startDate: this.requestData.startDate,
                    endDate: this.requestData.startDate,
                    description: this.requestData.description,
                    peopleNum: 1,
                    peopleData: this.requestData.peopleData,
                    startTime: this.requestData.startTime,
                    endTime: this.requestData.startTime,
                    applyType: 1,
                    firstdApprover: 0,
                    secondApprover: 0,
                    repairType: 0,
                    uploadFileNames: this.requestData.uploadFileNames
                };

                let resp = await repair.saveRepair(param);
                this.$loading.close();

                if (resp.success) {
                    this.$messager.alert({
                        title: "系统提示",
                        icon: "success",
                        msg: "保存成功！"
                    });
                    this.close();
                } else {
                    this.$messager.alert({
                        title: "系统提示",
                        icon: "error",
                        msg: resp.result[0].errorMsg
                    });
                }
            },
            //整理上传文件名集合
            getUploadFileNames() {
                this.requestData.uploadFileNames = [];
                let upload1 = this.$refs.upload1.getUploadFileName();
                this.addFileNames(upload1);
                let upload2 = this.$refs.upload2.getUploadFileName();
                this.addFileNames(upload2);
                let upload3 = this.$refs.upload3.getUploadFileName();
                this.addFileNames(upload3);
            },
            //添加上传文件名到集合
            addFileNames(name) {
                if (name != null) {
                    this.requestData.uploadFileNames.push(name);
                }
            }
        }
    };
</script>

<style scoped></style>
